@charset 'UTF-8';
@import './common.scss';
@import '../fonts/iconfont.css';

*{
    margin: 0;
    padding: 0;
    text-decoration: none;
    list-style: none;
}

.web{
	header{
		position: absolute;
		width: 100vw;
		top: 0;
		left: 0;
		background-color: #FFFFFF;
		.box{
			width: 93vw;
			height: 7.5vw;
			margin: 6vw auto;
			display: flex;
			justify-content: space-between;
			.leftBox{
				button{
					width: 23vw;
					font-size: 4.5vw;
					font-weight: normal;
					font-stretch: normal;
					line-height: 6vw;
					letter-spacing: 0vw;
					color: #000000;
					border-radius: 10vw;
					border: 1px solid #FF9344;
					padding: 1.5vw 3.3vw;
					background-color: #FFFFFF;
				}
			}
			.centerBox{
				transform: translateX(-10%);
				span{
					font-size: 4vw;
					font-weight: normal;
					font-stretch: normal;
					line-height: 11vw;
					letter-spacing: 0vw;
					color: #000000;
					
				}
			}
			.rightBox{
				padding-top: 1vw;
				i{
					color: #FF9344;
					font-size: 8vw;
					
				}
			}
		}
	}
	main{
		position: absolute;
		width: 100vw;
		top: 20vw;
		bottom: 18vw;
		
		// 超出部分滚动条
		overflow: auto;
		.product{
			margin: 0 auto;
			width: 94vw;
			.imgBox{
				margin: 0 auto;
				width: 100%;
				height: 35vw;
				overflow: hidden;
				img{
					width: 100%;
				}
			}
			.price{
				margin-top: 3vw;
				display: flex;
				justify-content: space-between;
				.leftP{
					i{
						color: #FF9344;
						font-size: 10vw;
					}
					span{
						color: #FF9344;
						font-size: 10vw;
						font-weight: normal;
						font-stretch: normal;
						line-height: 6vw;
						letter-spacing: 0vw;
					}
				}
				.rightP{
					button{
						width: 15vw;
						height: 8vw;
						border-radius: 10vw;
						border: 1px solid #FF9344;
						font-size: 4vw;
						font-weight: normal;
						font-stretch: normal;
						line-height: 8vw;
						letter-spacing: 0vw;
						color: #ffffff;
						background-color: #FF9344;
					}
				}
			}
		}
		.assess{
			width: 89vw;
			margin: 0 auto;
			display: flex;
			justify-content: space-between;
			margin-top: 4vw;
			.leftA{
				i{
					font-size: 5vw;
					color: #FF9344;
				}
				span:first-of-type{
					font-size: 4vw;
					font-weight: normal;
					font-stretch: normal;
					line-height: 7vw;
					letter-spacing: 0vw;
					color: #000000;
				}
				span:last-of-type{
					font-size: 4vw;
					font-weight: normal;
					letter-spacing: 0vw;
					color: #ff9344;
					margin-left: -0.8vw;
				}
			}
			.rightA{
				a{
					font-size: 3vw;
					font-weight: normal;
					font-stretch: normal;
					line-height: 7vw;
					letter-spacing: 0vw;
					color: #8e8e8e;
				}
			}
		}
		.shopBox{
			.nav{
				width: 89vw;
				height: 9vw;
				margin: 0 auto;
				margin-top: 5vw;
				background-color: #ff9344;
				display: flex;
				justify-content: space-between;
				padding: 0 1vw;
				h2{
					font-size: 4vw;
					font-weight: normal;
					font-stretch: normal;
					line-height: 9vw;
					letter-spacing: 0vw;
					color: #ffffff;
				}
				a{
					font-size: 6vw;
					font-weight: normal;
					font-stretch: normal;
					line-height: 9vw;
					letter-spacing: 0vw;
					color: #ffffff;
				}
			}
			.shop{
				width: 89vw;
				margin: 1vw auto;
				position: relative;
				.leftS{
					display: inline-block;
					width: 24vw;
					height: 23vw;
					overflow: hidden;
					img{
						width: 100%;
					}
				}
				.centerS{
					display: inline-block;
					height: 21.5vw;
					margin-left: 3vw;
					h2{
						font-size: 4vw;
						font-weight: normal;
						font-stretch: normal;
						line-height: 6vw;
						letter-spacing: 0vw;
						color: #000000;
					}
					.score{
						i{
							color: #ff9344;
							font-size: 5vw;
						}
						span{
							font-size: 3vw;
							font-weight: normal;
							font-stretch: normal;
							line-height: 7vw;
							letter-spacing: 0vw;
							color: #929292;
						}
					}
					h3{
						font-size: 3vw;
						font-weight: normal;
						font-stretch: normal;
						line-height: 6vw;
						letter-spacing: 0vw;
						color: #929292;
					}
					a{
						font-size: 3vw;
						font-weight: normal;
						font-stretch: normal;
						line-height: 6vw;
						letter-spacing: 0vw;
						color: #ff9344;
					}
				}
				.rightS{
					display: inline-block;
					position: absolute;	
					right: -1vw;
					top: 8.5vw;
					button{
						width: 15vw;
						height: 8vw;
						background-color: #ff9344;
						border: none;
						font-size: 4vw;
						font-weight: normal;
						font-stretch: normal;
						line-height: 8vw;
						letter-spacing: 0vw;
						color: #ffffff;
						border-radius: 10vw;
					}
				}
			}
		}
	}
}